<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta charset="utf-8"/>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <title>郑州二七区图书馆</title>
    <link href="css/reset.css" rel="stylesheet" type="text/css"/>
    <link href="css/index.css" rel="stylesheet" type="text/css"/>
    <script src="js/jquery.js" type="text/javascript"></script>
    <script type="text/javascript" src="js/jquery1.42.min.js"></script>
    <script type="text/javascript" src="js/jquery.SuperSlide.2.1.1.js"></script>
    <script type="text/javascript" src="lib/js/js.cookie.min.js"></script>


</head>

<body>
<!--头部页眉-->
<div class="top_one">
    <div class=" zhong">
        <a class="welcome">欢迎来到郑州二七区图书馆!</a>
        <ul>
            <li><a href="#" target="_blank">设为首页</a></li>
            <li><a href="#" target="_blank">联系我们</a></li>
            <!--<li><a href="#" target="_blank">学校概况</a></li>-->
            <div class="cb"></div>
        </ul>
        <div class="clearfix"></div>
    </div>
</div>
<!--logo+电话-->
<div class="top">
    <!--<div class="zhong">-->
    <!--<div class="logo"><img src="imgs/logo.png" /></div>-->
    <!--<div class="dianhua"><img src="imgs/wx.png" /></div>-->
    <!--<div class="clearfix"></div>-->
    <!--</div>-->
</div>
<!--导航-->
<div class="top_nav">
    <div class="nav">
        <div class="nav_left">
            <a href="booklist.html" target="_blank">开始浏览</a>
        </div>
        <div class="nav_right">
            <ul id="msg">


                <!--<li><a href="#" target="_blank">联系我们</a></li>-->

                <div class="cb"></div>
            </ul>
        </div>
        <div class="cb"></div>
    </div>
</div>
<!--banner-->
<div class="banner_container">
    <div class="banner">
        <ul>
            <li><img src="imgs/banner.jpg"></li>
            <li><img src="imgs/banner.jpg"></li>
            <li><img src="imgs/banner.jpg"></li>
            <li><img src="imgs/banner.jpg"></li>
        </ul>
    </div>
    <ul class="banner_btn">
        <li class="currentLi"></li>
        <li></li>
        <li></li>
    </ul>
</div>
<script>
    var cu = Cookies.get("user");
    console.log(cu);
    if(cu) {
        var uu = JSON.parse(cu);
        $("#msg").html("<li>\n" +
            "                    <a href=\"booklist.html\" target=\"_blank\">" + uu.uname + "</a>\n" +
            "                    <ul class=\"children\">\n" +
            "                        <li><a href=\"#\" target=\"_blank\">用户信息</a></li>\n" +
            "                        <li><a href=\"#\" target=\"_blank\">退出</a></li>\n" +
            "                    </ul>\n" +
            "                </li>")
    } else {
        $("#msg").html("<li><a href=\"login.html\" target=\"_blank\">登录</a></li>")
    }
    /*重新设置banner宽度*/
    $(".banner").css({width: 1920 * $(".banner img").length});
    /*记录播放索引值*/
    var n = 0;

    /*播放函数*/
    function runLeft() {
        if (n < $(".banner img").length - 1) {
            n = n + 1;
        } else {
            $(".banner").css({marginLeft: -960});
            n = 1;
        }
        $(".banner").stop().animate({marginLeft: (-960 - 1920 * n)}, 1000);
        $(".banner_btn li").removeClass("currentLi");
        if (n == $(".banner img").length - 1) {
            $(".banner_btn li").eq(0).addClass("currentLi");
        } else {
            $(".banner_btn li").eq(n).addClass("currentLi");
        }
    }

    var timer = setInterval(runLeft, 4000);
    /*按钮控制*/
    $(".banner_btn li").hover(function () {
        clearInterval(timer);
        n = $(".banner_btn li").index(this);
        $(".banner").stop().animate({marginLeft: (-960 - 1920 * n)}, 1000);
        $(".banner_btn li").removeClass("currentLi");
        $(this).addClass("currentLi");
    }, function () {
        timer = setInterval(runLeft, 4000);
    })
</script>


<div class="xinxi">
    <!--banner下的第一个板块第一个div的板块-最新信息-->
    <div class="xinxi_one">
        <div class="title">
            <h2><i><img src="imgs/01icon.png"/></i><span>最新信息</span></h2>
            <a href="#"><img src="imgs/more.png"/></a>
        </div>
        <div class="one_list">
            <ul>
                <li><a href="#" target="_blank"><h1>近日图书馆新进一批热门书籍</h1><span>2017-6-18</span></a></li>
                <li><a href="#" target="_blank"><h1>近日图书馆新进一批热门书籍</h1><span>2017-6-18</span></a></li>
                <li><a href="#" target="_blank"><h1>近日图书馆新进一批热门书籍</h1><span>2017-6-18</span></a></li>
                <li><a href="#" target="_blank"><h1>近日图书馆新进一批热门书籍</h1><span>2017-6-18</span></a></li>
                <li><a href="#" target="_blank"><h1>近日图书馆新进一批热门书籍</h1><span>2017-6-18</span></a></li>
                <li><a href="#" target="_blank"><h1>近日图书馆新进一批热门书籍</h1><span>2017-6-18</span></a></li>
                <li><a href="#" target="_blank"><h1>近日图书馆新进一批热门书籍</h1><span>2017-6-18</span></a></li>
                <li><a href="#" target="_blank"><h1>近日图书馆新进一批热门书籍</h1><span>2017-6-18</span></a></li>
            </ul>
        </div>
    </div>
    <!--banner下的第二个板块第二个div的板块-通知公告-->
    <div class="xinxi_two">
        <div class="title">
            <h2><i><img src="imgs/01icon.png"/></i><span>推荐图书公告</span></h2>
            <a href="#"><img src="imgs/more.png"/></a>
        </div>
        <div class="two_list">
            <ul>
                <li><a href="#" target="_blank"><h1>推荐图书：浮生物语</h1><span>2018-04-18</span></a></li>
                <li><a href="#" target="_blank"><h1>推荐图书：浮生物语</h1><span>2018-04-18</span></a></li>
                <li><a href="#" target="_blank"><h1>推荐图书：浮生物语</h1><span>2018-04-18</span></a></li>
                <li><a href="#" target="_blank"><h1>推荐图书：浮生物语</h1><span>2018-04-18</span></a></li>
                <li><a href="#" target="_blank"><h1>推荐图书：浮生物语</h1><span>2018-04-18</span></a></li>
                <li><a href="#" target="_blank"><h1>推荐图书：浮生物语</h1><span>2018-04-18</span></a></li>
                <li><a href="#" target="_blank"><h1>推荐图书：浮生物语</h1><span>2018-04-18</span></a></li>
                <li><a href="#" target="_blank"><h1>推荐图书：浮生物语</h1><span>2018-04-18</span></a></li>
            </ul>
        </div>
    </div>
    <!--banner下的第一个板块第三个div的板块-->
    <!--<div class="xinxi_three">-->
    <!--<div class="three_ban">-->
    <!--<ul>-->
    <!--<li><a href="#" target="_blank"><img src="imgs/icon1.png"/>-->
    <!--<p>学生风采</p></a></li>-->
    <!--<li><a href="#" target="_blank"><img src="imgs/icon2.png"/>-->
    <!--<p>教研活动</p></a></li>-->
    <!--<li><a href="#" target="_blank"><img src="imgs/icon3.png"/>-->
    <!--<p>教师队伍</p></a></li>-->
    <!--<li><a href="#" target="_blank"><img src="imgs/icon4.png"/>-->
    <!--<p>咨询1号</p></a></li>-->
    <!--<li><a href="#" target="_blank"><img src="imgs/icon4.png"/>-->
    <!--<p>咨询2号</p></a></li>-->
    <!--<li><a href="#" target="_blank"><img src="imgs/icon4.png"/>-->
    <!--<p>咨询3号</p></a></li>-->
    <!--<div class="cb"></div>-->
    <!--</ul>-->
    <!--</div>-->
    <!--<div class="three_list">-->
    <!--<ul>-->
    <!--<li><a href="#" target="_blank"><img src="imgs/ricon.png"/>-->
    <!--<p>报名须知</p></a></li>-->
    <!--<li><a href="#" target="_blank"><img src="imgs/ricon2.png"/>-->
    <!--<p>联系我们</p></a></li>-->
    <!--<li><a href="#" target="_blank"><img src="imgs/ricon3.png"/>-->
    <!--<p>校园动态</p></a></li>-->
    <!--<li><a href="#" target="_blank"><img src="imgs/ricon4.png"/>-->
    <!--<p>学院简介</p></a></li>-->
    <!--<div class="cb"></div>-->
    <!--</ul>-->
    <!--</div>-->
    <!--</div>-->
    <div class="cb"></div>
</div>


</body>
</html>

